<!doctype html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>LTable - 工单系统</title>

    <!-- begin::global styles -->
    <link rel="stylesheet" th:href="@{/vendors/bundle.css}" type="text/css">
    <!-- end::global styles -->

    <!-- begin::custom styles -->
    <link rel="stylesheet" th:href="@{/css/app.css}" type="text/css">
    <link rel="stylesheet" th:href="@{/css/custom.css}" type="text/css">
    <!-- end::custom styles -->

</head>
<body>

<!-- begin::side menu -->
<div class="side-menu">
    <div class='side-menu-body'>
        <ul>
            <li class="open">
                <a class="active" th:href="@{/index}"><i class="icon ti-home"></i> <span>首页</span> </a>
            </li>
            <li><a th:href="@{/create_order}"><i class="icon ti-paint-bucket"></i> <span>创建工单</span></a></li>
            <li><a th:href="@{/order_in_handle}"><i class="icon ti-layers-alt"></i> <span>正在处理</span> </a></li>
            <li><a th:href="@{/order_history}"><i class="icon ti-rocket"></i> <span>历史工单</span> </a></li>

            <li>
                <a data-attr="layout-builder-toggle" href="#">
                    <i class="icon ti-layout"></i>
                    <span>模式</span>
                </a>
            </li>

        </ul>
    </div>
</div>

<div th:replace="~{commons/commons::businessnavbar}"></div>

<!-- end::navbar -->
<!--主要展示内容 在main里显示-->
<!-- begin::main content -->
<main class="main-content">
    <div class="container-fluid">
        <div class="card">
            <div class="row">
                <div class="col-md-1">

                </div>
                <!--左边部分 展示id 头像 昵称-->
                <div class="col-md-5 m-b-15" >
                    <br>
                    <div class="row">
                        <div class="col-md-3">

                        </div>
                        <div class="col-md-6">
                            <figure class="avatar avatar-xl">
                                <img th:src="${theuser.getPhoto()}" class="rounded-circle"  th:alt="${theuser.getUsername()}" onerror="this.src='../media/image/avatar1.jpg'">
                            </figure>
                        </div>

                        <div class="col-md-3">

                        </div>
                    </div>
                    <br>
                    <br>
                    <div class="row">
                        <div class="col-md-6">
                            UID:<span  th:text="${theuser.getUid()}" ></span>
                        </div>
                        <div class="col-md-6">
                            昵称:<span th:text="${theuser.getUsername()}" ></span>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-9">
                            最近登录:<span th:text="${theuser.getLogintime()}"></span>
                        </div>
                    </div>
                </div>
                <!--右边部分展示其他信息 比如-->
                <div class="col-md-5">
                    <br>
                    <form th:action="@{/update_user}" method="post">
                        <div class="row">
                            <div class="col-md-6">
                                年龄：<input class="form-control" type="text" name="age" placeholder="未认证......" th:value="${theuser.getAge()}" >
                            </div>
                            <div class="col-md-6">
                                地址：<input class="form-control" type="text" name="address" placeholder="请输入您的地址" th:value="${theuser.getAddress()}" >
                            </div>
                        </div>

                        <div class="row">
                            <div class="col-md-6">
                                性别：<input class="form-control" type="text" name="gender" placeholder="请输入您的性别（男/女）" th:value="${theuser.getGender()==0?'女':'男'}">
                            </div>
                            <div class="col-md-6">
                                头像：<input class="form-control" type="text" name="photo" placeholder="请更换您的头像" th:value="${theuser.getPhoto()}" >
                            </div>
                        </div>
                        <br>
                        <div class="row">
                            <div class="col-md-3"></div>
                            <div class="col-md-6">
                                <button class="btn btn-primary btn-lg btn-block btn-uppercase mb-4 row">更新</button>
                            </div>
                            <div class="col-md-3"></div>
                        </div>

                    </form>
                </div>
                <div class="col-md-1">

                </div>
            </div>
            <br>
        </div>
    </div>
</main>
<!-- end::main content -->

<!-- begin::global scripts -->
<script th:src="@{/vendors/bundle.js}"></script>
<!-- end::global scripts -->


<!-- begin::dashboard -->
<script th:src="@{/js/examples/dashboard.js}"></script>
<!-- end::dashboard -->

<!-- begin::custom scripts -->
<script th:src="@{/js/custom.js}"></script>
<script th:src="@{/js/app.js}"></script>
<!-- end::custom scripts -->

</body>
</html>